<script lang="ts" setup>
import { computed, onBeforeMount, onMounted, ref, watch } from 'vue'
import { RouterName, useKeepAlive } from './store/keepAlive'
import { useRoute, useRouter } from 'vue-router'
import WujieVue from 'wujie-vue3'
const route = useRoute()
const router = useRouter()
const store = useKeepAlive()

const keepAliveList = computed(() => {
  return store.keepAliveList.map((item) => item?.toString() || '')
})
const count = ref(0)
let time = true
let timeout: any = null
watch(route, () => {
  // if(!time) return
  // change
  ;(window as any).$wujie?.bus.$emit('sub-route-change', 'cso', route.path)
})
onMounted(() => {
  ;(window as any).$wujie?.bus.$on('cso-router-change', (path: string) => {
    // debugger
    console.log('cso ', path)
    if(!path) {
      router.push('/')
      return
    }
    
    router.push(path)
  })
})

// 向父应用告知路由变化
</script>
<template>
  <nav>
    <div @click="count++">{{ count }}</div>
    <router-link to="/">CSOHome</router-link> |
    <router-link to="/about">CSOAbout</router-link>
  </nav>
  <router-view v-slot="{ Component }">
    <keep-alive>
      <component :is="Component" />
    </keep-alive>
  </router-view>
</template>
<style lang="less"></style>
